<!DOCTYPE html
PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
	<title>测试查找的树</title>
	<script type="text/javascript" src="js/lib/jquery.js"></script>
	<script type="text/javascript" src="js/lib/jquery.cookie.js"></script>
	<script type="text/javascript" src="js/lib/jquery.hotkeys.js"></script>
	<script type="text/javascript" src="js/lib/jquery.jstree.min.js"></script>

	<style type="text/css">
	html, body { margin:0; padding:0; }
	body, td, th, pre, code, select, option, input, textarea { font-family:verdana,arial,sans-serif; font-size:10px; }
	.demo, .demo input, .jstree-dnd-helper, #vakata-contextmenu { font-size:10px; font-family:Verdana; }
	#container { width:780px; margin:10px auto; overflow:hidden; position:relative; }
	#demo { width:auto; height:400px; overflow:auto; border:1px solid gray; }

	#menu { height:30px; overflow:auto; }
	#text { margin-top:1px; }

	#alog { font-size:9px !important; margin:5px; border:1px solid silver; }
	</style>
</head>
<body>
<div id="container">
<div id="menu">
<input type="button" id="copy" value="copy" style="display:block; float:left;"/>
<input type="button" id="paste" value="paste" style="display:block; float:left;"/>
<input type="button" id="clear_search" value="clear" style="display:block; float:right;"/>
<input type="button" id="search" value="search" style="display:block; float:right;"/>
<input type="text" id="text" value="" style="display:block; float:right;" />
</div>
<div id="demo" class="demo">
	<ul>
		<li>
			<a href="#">图书列表</a>
			<ul>
					<li><input type="checkbox"/><a>数学</a></li>
					<li><a href="#">语文</a></li>
					<li><a href="#">英语</a></li>
					<li><a href="#">历史</a></li>
					<li><a href="#">政治</a></li>
					<li><a href="#">地理</a></li>
			</ul>	
		</li>
	</ul>	
	
</div>

<script type="text/javascript">
$(function () {
	$("#demo").jstree({ 
		"plugins" : [ "themes", "html_data", "ui","cookies","search", "types", "hotkeys", "contextmenu"]
		});
		 $("#demo").jstree("set_theme","classic");  
});
</script>
<script type="text/javascript">
$(function () {
 
	$("#menu input").click(function () {
		switch(this.id) {
			case "add_default":
			case "add_folder":
				$("#demo").jstree("create", null, "last", { "attr" : { "rel" : this.id.toString().replace("add_", "") } });
				break;
			case "search":
				$("#demo").jstree("search", document.getElementById("text").value);
				break;
			case "text": break;
		//	case "clear_search": $("#demo").jstree(this.id);
			default:
			//	$("#demo").jstree(this.id);
				break;
		}
	});
	$("clear_serach").click(function(){
		$("#demo").jstree("demo");
	});
});
</script>
</div>

</body>
</html>